Security News
Cloudflare Adds Security.txt Setup Wizard
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
@material/button
Advanced tools
The MDC Button component is a spec-aligned button component adhering to the Material Design button requirements. It works without JavaScript with basic functionality for all states. If you initiate the JavaScript object for a button, then it will be enhanced with ripple effects. (Not yet implemented)
npm install --save @material/button
<button class="mdc-button">
Flat button
</button>
<button class="mdc-button mdc-button--accent">
Colored button
</button>
<button class="mdc-button mdc-button--raised">
Raised button
</button>
<button class="mdc-button mdc-button--raised" disabled>
Raised disabled button
</button>
To add the ink ripple effect to a button, attach a ripple instance to the button element.
mdc.ripple.MDCRipple.attachTo(document.querySelector('.mdc-button'));
You can also do this declaratively when using the material-components-web package.
<button class="mdc-button" data-mdc-auto-init="MDCRipple">
Flat button
</button>
Buttons are fully aware of ripple styles, so no DOM or CSS changes are required to use them.
The block class is mdc-button
. This defines the top-level button element.
The button component has no inner elements.
The provided modifiers are:
Class | Description |
---|---|
mdc-button--dense | Compresses the button text to make it slightly smaller. |
mdc-button--raised | Elevates the button and creates a colored background. |
mdc-button--compact | Reduces the amount of horizontal padding in the button. |
mdc-button--primary | Colors the button with the primary color. |
mdc-button--accent | Colors the button with the accent color. |
FAQs
The Material Components for the web button component
The npm package @material/button receives a total of 845,758 weekly downloads. As such, @material/button popularity was classified as popular.
We found that @material/button demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 15 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Cloudflare has launched a setup wizard allowing users to easily create and manage a security.txt file for vulnerability disclosure on their websites.
Security News
The Socket Research team breaks down a malicious npm package targeting the legitimate DOMPurify library. It uses obfuscated code to hide that it is exfiltrating browser and crypto wallet data.
Security News
ENISA’s 2024 report highlights the EU’s top cybersecurity threats, including rising DDoS attacks, ransomware, supply chain vulnerabilities, and weaponized AI.